Ext.define('DCApp.view.Detail', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.detail',
    
    requires: [
       'Ext.form.Panel',
       'Ext.form.field.Text',
       'Ext.form.field.TextArea',
       'Ext.layout.container.VBox',
       'Ext.layout.container.Anchor',
       'Ext.form.field.ComboBox',
       'Ext.view.View'
    ],
    
    layout: {
        type: 'vbox',
        pack: 'start',
        align: 'stretch'
    },
    
    bodyPadding: 0,
        
    onscroll:function(top,h0){
    	var items_navpos=this.items_navpos;
    	var offset=0;
    	//var h0 = this.h0;
    	for(var i=0; i<items_navpos.length; i++){
    		var item_navpos=items_navpos[i];
    		var h = item_navpos.getHeight();
    		//header落在移动窗口之内,或移动窗口在 两个offset之间都算
    		if((offset>=top && (offset<= (top+h0)))
    				|| (top>=offset && (top+h0) <= offset+h ))
    			break;
    		offset+=h;    		
    	}
    	this.nav(this.btns_dock.getAt(i));
    },
    nav:function(item,e){
    	if(!item)
    		return false;
    	if(this.item_last){
    		if(this.item_last==item)
    			return false;
    		this.item_last.removeCls('x-tab-active');
    	}
    	var pnav = item.pnav;
    	if(e){
        	pnav.getEl().scrollIntoView(pnav.up().getEl(),false,true);     
    	}else{
    		item.addCls('x-tab-active');
    	}
    	this.item_last=item;
    },
    afterRender: function() {
    	var items_dock=[];
    	var items_navpos=this.query('[cls=nav_pos]');
    	var me = this;
    	for(var i=0; i<items_navpos.length; i++){
    		var item_navpos=items_navpos[i];
    		var item_dock = {
    			closable:false,
    			text:item_navpos.title,
    			pnav:item_navpos,
    			handler:me.nav,
    			scope: me
    		};
    		items_dock[items_dock.length]=item_dock;
    	}
    	this.items_navpos=items_navpos;
    	this.btns_dock = this.addDocked([{
	        xtype: 'tabbar',
	        dock: 'top',
	        id:'tbar0',
	        activeItem:1,
	        items: items_dock
	    }])[0].items;
    	this.nav(this.btns_dock.getAt(0));
    	this.callParent();
    }    
});
